<template>
	<view class="payRecord">
		<view class="container">
			<view class="cont" v-for="(item,i) in recordList" :key="i">
				<view class="left">
					<view class="title">充{{item.recharge}}享{{item.give}}折</view>
					<view class="time">{{item.paymentTime}}</view>
				</view>
				<view class="right">
					<view class="total">+{{item.recharge}}</view>
					<view class="actualPayment">{{item.total}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		payRecord
	} from "@/api/getData.js";
	export default {
		data() {
			return {
				recordList: []
			}
		},
		onLoad(options) {
			this.payRecord()
		},
		methods: {
			//充值记录列表
			async payRecord() {
				const {
					data: res
				} = await payRecord()
				console.log(res, 22222)
				this.recordList = res.data
			},
		}
	}
</script>

<style lang="less">
	.payRecord {
		.container {
			padding: 32rpx;

			.cont {
				border-radius: 16rpx;
				background: #fff;
				padding: 32rpx;
				display: flex;
				justify-content: space-between;
				margin-bottom: 32rpx;
				line-height: 1;

				.title {
					font-size: 28rpx;
				}

				.time {
					font-size: 20rpx;
					color: #989898;
					margin-top: 14rpx;
				}

				.total {
					font-size: 32rpx;
					color: #E60012;
					font-weight: bold;
				}

				.actualPayment {	
					font-size: 20rpx;
					color: #989898;
					margin-top: 14rpx;
				}
			}
		}
	}
</style>
